<template>
  <div>
    <div>
      <el-form size="medium">
        <el-form :inline="true">
          <el-form-item label="方案名称">
            <el-select v-model="supplierId"
                       filterable
                       placeholder="请选择金融产品公司"
                       @change="getproductNameList(supplierId)">
              <el-option v-for="item in companyList"
                         :key="item.value"
                         :label="item.label"
                         :value="item.value">
              </el-option>
            </el-select>
            <el-select v-model="productId"
                       filterable
                       placeholder="请选择方案名称">
              <el-option v-for="item in productNameList"
                         :key="item.value"
                         :label="item.label"
                         :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="状态">
            <el-select v-model="status"
                       placeholder="请选择审核状态">
              <el-option label="预审中"
                         value=10></el-option>
              <el-option label="待提交评估"
                         value=150></el-option>
              <el-option label="车辆评估中"
                         value=160></el-option>
              <el-option label="评估失败"
                         value=170></el-option>
              <el-option label="待提报"
                         value=20></el-option>
              <el-option label="预审失败"
                         value=30></el-option>
              <el-option label="终审中"
                         value=40></el-option>
              <el-option label="放款资料补充"
                         value=50></el-option>
              <el-option label="终审失败"
                         value=60></el-option>
              <el-option label="已完成"
                         value=70></el-option>
              <el-option label="产品已下架"
                         value=80></el-option>
              <el-option label="放款审核中"
                         value=90></el-option>
              <el-option label="放款失败"
                         value=100></el-option>
              <el-option label="抵押资料补充"
                         value=110></el-option>
              <el-option label="抵押审核中"
                         value=120></el-option>
              <el-option label="抵押放款资料补充"
                         value=130></el-option>
              <el-option label="抵押审核失败"
                         value=140></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="车商公司名">
            <el-select v-model="userId"
                       filterable
                       placeholder="请选择车商公司名称">
              <el-option v-for="item in dealerCompanyNameList"
                         :key="item.userId"
                         :label="item.companyName"
                         :value="item.userId">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item size="large">
            <el-button type="primary"
                       @click="getOrderList">查询</el-button>
            <el-button type="primary"
                       @click="reset">重置</el-button>
          </el-form-item>
        </el-form>
        <el-form :inline="true">
          <el-form-item label="客户名">
            <el-input v-model="customerName"
                      placeholder="请输入"></el-input>
          </el-form-item>
          <el-form-item label="客户电话">
            <el-input v-model.number="phone"
                      placeholder="请输入"></el-input>
          </el-form-item>
        </el-form>
      </el-form>
      <el-table ref="multipleTable"
                border
                stripe
                :data="orderList"
                tooltip-effect="dark"
                style="width: 100%">
        <el-table-column prop="supplierCompanyName"
                         label="金融产品公司"></el-table-column>
        <el-table-column prop="productName"
                         label="方案名称"></el-table-column>
        <el-table-column prop="dealerCompanyName"
                         label="经纪人公司名"></el-table-column>
        <el-table-column prop="dealerPhone"
                         label="经纪人联系方式"></el-table-column>
        <el-table-column prop="customerName"
                         label="客户名"></el-table-column>
        <el-table-column prop="customerPhone"
                         label="客户手机号"></el-table-column>
        <el-table-column prop="createdTime"
                         label="创建时间"></el-table-column>
        <el-table-column prop="statusName"
                         label="审核状态"></el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button v-if="scope.row.status === 10 || scope.row.status === 40 || scope.row.status === 90 || scope.row.status === 120 || scope.row.status === 160"
                       @click="judge(scope.row.orderId)"
                       type="primary"
                       size="mini"
                       plain>审核</el-button>
            <el-button v-if="scope.row.status == 50 || scope.row.status == 110 || scope.row.status == 130 || ((scope.row.status == 100 || scope.row.status == 140 ) && (scope.row.unpassType == 1 || scope.row.unpassType == 4)) "
                       @click="upload(scope.row.orderId)"
                       type="success"
                       size="mini"
                       plain>补充材料</el-button>
            <el-button v-else
                       @click="detail(scope.row.orderId)"
                       type="info"
                       size="mini"
                       plain>详情</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="table-foot">
      </div>
    </div>
    <view-page :current-page="currentPage"
               :total="total"
               @change="pageChange"></view-page>
  </div>
</template>

<script>
import { vListLength } from '@/utils/validate'
import '@/style/common.scss'
import viewPage from '@/components/pagination'
import { HTTPSUCCESS, HTTPDATAFAIL, HTTPPARAMFAIL, HTTPUNKOWNFAIL } from '@/components/constant'
import { api } from '@/api'

export default {
  data() {
    return {
      orderId: this.$route.query.orderId || null,
      supplierId: null,
      productId: null,
      companyName: [],
      productName: [],
      userId: null,
      phone: null,
      customerName: null,
      productNameList: [],
      companyList: [],
      dealerCompanyNameList: [],
      status: this.$route.query.status || null,
      currentPage: 1,
      total: 100,
      orderList: []
    }
  },
  activated() {
    this.getOrderList()
    this.getCompanyList()
    this.getDealerCompanyList()
  },
  components: { viewPage },
  methods: {
    vListLength,
    reset() {
      this.customerName = null
      this.phone = null
      this.status = null
      this.supplierId = null
      this.productId = null
      this.dealerCompanyNameList = []
      this.getOrderList()
      this.$router.push({
        name: 'order'
      })
    },
    getDealerCompanyList() {
      this.$http.get(api.SYS_USER_COMPANIES).then(
        res => {
          this.dealerCompanyNameList = res.data
        }
      )
    },
    getCompanyList() {
      this.$http.get(api.SYS_SUPPLIER_ALL).then(
        res => {
          this.companyList = res.data
        }
      )
    },
    getproductNameList(id) {
      this.$http._get(api.SYS_PRODUCT_SUPPLIER, id).then(
        res => {
          this.productNameList = res.data
        }
      )
    },
    getOrderList() {
      const params = {
        orderId: this.orderId,
        supplierId: this.supplierId,
        productId: this.productId,
        status: this.status,
        userId: this.userId,
        customerName: this.customerName,
        customerPhone: this.phone,
        pageNum: this.currentPage,
        pageSize: 10
      }
      this.$http.post(api.SYS_ORDER_LIST, params).then(
        res => {
          if (res.code === HTTPSUCCESS) {
            this.currentPage = res.data.pageNum
            this.total = res.data.totalSize
            this.orderList = res.data.orderList
          } else {
            this.$msg._message(res.data.msg, 'error')
          }
        }
      )
    },
    judge(id) {
      this.$router.push({
        name: 'judgeOrder',
        params: { orderId: id, infoFlag: '0' }
      })
    },
    upload(id) {
      this.$router.push({
        name: 'uploadOrder',
        params: { orderId: id, infoFlag: '2' }
      })
    },
    detail(id) {
      this.$router.push({
        name: 'orderInfo',
        params: { orderId: id, infoFlag: '1' }
      })
    },
    pageChange(page) {
      this.currentPage = page
      this.getOrderList()
    }
  }

}
</script>
